<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	
	<body>
		<button id="btn1" onclick="fun1()">click</button>
	</body>
	
	<script type="text/javascript" src="../js/component/jquery-1.11.0.min.js" ></script>
	<script type="text/javascript" src="../js/component/jquery.json2xml.js" ></script>
	<script type="text/javascript" src="../js/component/jquery.xml2json.js" ></script>
	
	<script>
		function fun1() {
			/*$.ajax({
				type: "post",
				url: "http://localhost/bpm/first",
				data: {
					//bpmnXml: json2BPMN.convert(flowData, process, root)
					//bpmnXml: '<?xml version="1.0" encoding="UTF-8" standalone="yes"?><definitions xmlns="http://www.omg.org/spec/BPMN/20100524/MODEL" xmlns:activiti="http://activiti.org/bpmn" xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI" xmlns:omgdc="http://www.omg.org/spec/DD/20100524/DC" xmlns:omgdi="http://www.omg.org/spec/DD/20100524/DI" xmlns:tns="http://www.activiti.org/test" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" expressionLanguage="http://www.w3.org/1999/XPath" id="m1547445846249" name="" targetNamespace="http://www.activiti.org/test" typeLanguage="http://www.w3.org/2001/XMLSchema">  <process id="demo" isClosed="false" isExecutable="true" name="My process" processType="None">    <startEvent id="startevent1" name="Start"/>    <userTask activiti:exclusive="true" id="usertask1" name="申请"/>    <userTask activiti:exclusive="true" id="usertask2" name="审批"/>    <endEvent id="endevent1" name="End"/>    <sequenceFlow id="flow1" sourceRef="usertask2" targetRef="endevent1"/>    <sequenceFlow id="flow2" sourceRef="usertask1" targetRef="usertask2"/>    <sequenceFlow id="flow3" sourceRef="startevent1" targetRef="usertask1"/>  </process>  <bpmndi:BPMNDiagram documentation="background=#3C3F41;count=1;horizontalcount=1;orientation=0;width=842.4;height=1195.2;imageableWidth=832.4;imageableHeight=1185.2;imageableX=5.0;imageableY=5.0" id="Diagram-_1" name="New Diagram">    <bpmndi:BPMNPlane bpmnElement="demo">      <bpmndi:BPMNShape bpmnElement="startevent1" id="Shape-startevent1">        <omgdc:Bounds height="32.0" width="32.0" x="85.0" y="230.0"/>        <bpmndi:BPMNLabel>          <omgdc:Bounds height="32.0" width="32.0" x="0.0" y="0.0"/>        </bpmndi:BPMNLabel>      </bpmndi:BPMNShape>      <bpmndi:BPMNShape bpmnElement="usertask1" id="Shape-usertask1">        <omgdc:Bounds height="55.0" width="105.0" x="226.0" y="220.0"/>        <bpmndi:BPMNLabel>          <omgdc:Bounds height="55.0" width="105.0" x="0.0" y="0.0"/>        </bpmndi:BPMNLabel>      </bpmndi:BPMNShape>      <bpmndi:BPMNShape bpmnElement="usertask2" id="Shape-usertask2">        <omgdc:Bounds height="55.0" width="105.0" x="426.0" y="220.0"/>        <bpmndi:BPMNLabel>          <omgdc:Bounds height="55.0" width="105.0" x="0.0" y="0.0"/>        </bpmndi:BPMNLabel>      </bpmndi:BPMNShape>      <bpmndi:BPMNShape bpmnElement="endevent1" id="Shape-endevent1">        <omgdc:Bounds height="32.0" width="32.0" x="645.0" y="230.0"/>        <bpmndi:BPMNLabel>          <omgdc:Bounds height="32.0" width="32.0" x="0.0" y="0.0"/>        </bpmndi:BPMNLabel>      </bpmndi:BPMNShape>      <bpmndi:BPMNEdge bpmnElement="flow1" id="BPMNEdge_flow1" sourceElement="usertask2" targetElement="endevent1">        <omgdi:waypoint x="531.0" y="247.5"/>        <omgdi:waypoint x="645.0" y="246.0"/>        <bpmndi:BPMNLabel>          <omgdc:Bounds height="-1.0" width="-1.0" x="-1.0" y="-1.0"/>        </bpmndi:BPMNLabel>      </bpmndi:BPMNEdge>      <bpmndi:BPMNEdge bpmnElement="flow2" id="BPMNEdge_flow2" sourceElement="usertask1" targetElement="usertask2">        <omgdi:waypoint x="331.0" y="247.5"/>        <omgdi:waypoint x="426.0" y="247.5"/>        <bpmndi:BPMNLabel>          <omgdc:Bounds height="-1.0" width="-1.0" x="-1.0" y="-1.0"/>        </bpmndi:BPMNLabel>      </bpmndi:BPMNEdge>      <bpmndi:BPMNEdge bpmnElement="flow3" id="BPMNEdge_flow3" sourceElement="startevent1" targetElement="usertask1">        <omgdi:waypoint x="117.0" y="246.0"/>        <omgdi:waypoint x="226.0" y="247.5"/>        <bpmndi:BPMNLabel>          <omgdc:Bounds height="-1.0" width="-1.0" x="-1.0" y="-1.0"/>        </bpmndi:BPMNLabel>      </bpmndi:BPMNEdge>    </bpmndi:BPMNPlane>  </bpmndi:BPMNDiagram></definitions>'
					bpmnXml: '<?xml version="1.0" encoding="UTF-8" standalone="yes"?><definitions xmlns="http://www.omg.org/spec/BPMN/20100524/MODEL" xmlns:activiti="http://activiti.org/bpmn" xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI" xmlns:omgdc="http://www.omg.org/spec/DD/20100524/DC" xmlns:omgdi="http://www.omg.org/spec/DD/20100524/DI" xmlns:tns="http://www.activiti.org/test" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" expressionLanguage="http://www.w3.org/1999/XPath" id="m1547445846249" name="" targetNamespace="http://www.activiti.org/test" typeLanguage="http://www.w3.org/2001/XMLSchema">  <process id="demo" isClosed="false" isExecutable="true" name="My process" processType="None">    <startEvent id="startevent1" name="Start"/>    <userTask activiti:exclusive="true" id="usertask1" name="申请"/>    <userTask activiti:exclusive="true" id="usertask2" name="审批"/>    <endEvent id="endevent1" name="End"/>    <sequenceFlow id="flow1" sourceRef="usertask2" targetRef="endevent1"/>    <sequenceFlow id="flow2" sourceRef="usertask1" targetRef="usertask2"/>    <sequenceFlow id="flow3" sourceRef="startevent1" targetRef="usertask1"/>  </process></definitions>'
				},
				success: function(res) {
					console.log(res);
				}
			});*/
			
			var bpmnxml = json2BPMN.convert(flowData, process, root)
			console.log(bpmnxml);
		}
		
		var flowData = {
			"nodeDataArray": [
				{
					"text": "开始",
					"key": "E00001",
					"nodeType": "start",
					"locTop": 539,
					"locLeft": 507,
					"nodeHeight": "60px",
					"nodeWidth": "60px",
					"bgColor": "#78dc6b"
				},
				{
					"text": "填写申请单",
					"key": "T00001",
					"nodeType": "comm",
					"locTop": 538.97998046875,
					"locLeft": 743,
					"nodeHeight": "60px",
					"nodeWidth": "100px",
					"bgColor": "#6babdc"
				},
				{
					"text": "财务部审批",
					"key": "T00002",
					"nodeType": "comm",
					"locTop": 378.97998046875,
					"locLeft": 743,
					"nodeHeight": "60px",
					"nodeWidth": "100px",
					"bgColor": "#6babdc"
				},
				{
					"text": "总经理审批",
					"key": "T00003",
					"nodeType": "comm",
					"locTop": 219,
					"locLeft": 743,
					"nodeHeight": "60px",
					"nodeWidth": "100px",
					"bgColor": "#6babdc"
				},
				{
					"text": "发放资金",
					"key": "T00004",
					"nodeType": "comm",
					"locTop": 387,
					"locLeft": 974,
					"nodeHeight": "60px",
					"nodeWidth": "100px",
					"bgColor": "#6babdc"
				},
				{
					"text": "确认资金",
					"key": "T00005",
					"nodeType": "comm",
					"locTop": 547,
					"locLeft": 974,
					"nodeHeight": "60px",
					"nodeWidth": "100px",
					"bgColor": "#6babdc"
				},
				{
					"text": "结束",
					"key": "E00002",
					"nodeType": "end",
					"locTop": 219,
					"locLeft": 1271,
					"nodeHeight": "60px",
					"nodeWidth": "60px",
					"bgColor": "#dc6b6b"
				},
				{
					"text": "结束",
					"key": "E00003",
					"nodeType": "end",
					"locTop": 547,
					"locLeft": 1280,
					"nodeHeight": "60px",
					"nodeWidth": "60px",
					"bgColor": "#dc6b6b"
				}
			],
			"linkDataArray": [
				{
					"from": "E00001",
					"to": "T00001",
					"routerId": "R00001",
					"label": "",
					"sourceAnchors": [ "Bottom", "Right", "Top", "Left" ],
					"targetAnchors": [ "Bottom", "Right", "Top", "Left"]
				},
				{
					"from": "T00001",
					"to": "T00002",
					"routerId": "R00002",
					"label": "",
					"sourceAnchors": [ "Bottom", "Right", "Top", "Left" ],
					"targetAnchors": [ "Bottom", "Right", "Top", "Left" ]
				},
				{
					"from": "T00002",
					"to": "T00003",
					"routerId": "R00003",
					"label": "",
					"sourceAnchors": [ "Bottom", "Right", "Top", "Left" ],
					"targetAnchors": [ "Bottom", "Right", "Top", "Left" ]
				},
				{
					"from": "T00003",
					"to": "E00002",
					"routerId": "R00004",
					"label": "不同意",
					"sourceAnchors": [ "Bottom", "Right", "Top", "Left" ],
					"targetAnchors": [ "Bottom", "Right", "Top", "Left" ]
				},
				{
					"from": "T00003",
					"to": "T00004",
					"routerId": "R00005",
					"label": "同意",
					"sourceAnchors": [ "Bottom", "Right", "Top", "Left" ],
					"targetAnchors": [ "Bottom", "Right", "Top", "Left" ]
				},
				{
					"from": "T00004",
					"to": "T00005",
					"routerId": "R00006",
					"label": "",
					"sourceAnchors": [ "Bottom", "Right", "Top", "Left" ],
					"targetAnchors": [ "Bottom", "Right", "Top", "Left" ]
				},
				{
					"from": "T00005",
					"to": "E00003",
					"routerId": "R00007",
					"label": "",
					"sourceAnchors": [ "Bottom", "Right", "Top", "Left" ],
					"targetAnchors": [ "Bottom", "Right", "Top", "Left" ]
				},
				{
					"from": "T00003",
					"to": "T00002",
					"routerId": "R00008",
					"label": "回退",
					"sourceAnchors": [ "Left" ],
					"targetAnchors": [ "Left" ]
				}
			]
		};
		
		var json2BPMN = {
			BPMNXml: '',
			processXml: '',
			nodeXml: '',
			lineXml: '',
			l: '<',
			r: '>',
			close: '/',
			rClose: '/>',
			enter: '\r\n',
			rootTab: 'definitions',
			processTab: 'process',
			lineTab: 'sequenceFlow',
			xmlHead: '<?xml version="1.0" encoding="UTF-8" standalone="yes"?>',
			convert: function(json, process, root) {
				var nodeDataArr = json.nodeDataArray;
				var linkDataArr = json.linkDataArray;
				for (var i in nodeDataArr) {
					var n = this.chooseNodeType(nodeDataArr[i]);
					this.nodeXml += this.l + n.type + this.appendAttr(n) + this.rClose + this.enter;
				}
				for (var j in linkDataArr) {
					var r = this.chooseLineType(linkDataArr[j]);
					this.lineXml += this.l + this.lineTab + this.appendAttr(r) + this.rClose + this.enter;
				}
				this.processXml = this.l + this.processTab + this.appendAttr(process) + this.r + this.enter + this.nodeXml + this.lineXml + 
								this.l + this.close + this.processTab + this.r;
				this.BPMNXml = this.xmlHead + this.enter + this.l + this.rootTab + this.appendAttr(root) + this.r + this.enter + this.processXml + 
								this.enter + this.l + this.close + this.rootTab + this.r;
				return this.BPMNXml;
			},
			chooseNodeType: function(node) {
				var newNode = {};
				switch(node.nodeType) {
					case 'start':
						newNode.type = 'startEvent';
						break;
					case 'comm':
						newNode.type = 'userTask';
						break;
					case 'end':
						newNode.type = 'endEvent';
						break;
				}
				newNode.id = node.key;
				newNode.name = node.text;
				return newNode;
			},
			chooseLineType: function(line) {
				var newLine = {};
				newLine.id = line.routerId;
				newLine.sourceRef = line.from;
				newLine.targetRef = line.to;
				return newLine;
			},
			appendAttr: function(n) {
				var attr = ' ';
				for (var key in n) {
					if (key == 'type') continue;
					attr += key + '="' + n[key] + '" ';
				}
				return attr.substring(0, attr.length-1);
			}
		}
		
		var process = {
			id: 'demo',
			isClosed: 'false',
			isExecutable: 'true',
			name: 'My process',
			processType: 'None'
		};
		var root = {
			'xmlns': 'http://www.omg.org/spec/BPMN/20100524/MODEL',
			'xmlns:activiti': 'http://activiti.org/bpmn',
			'xmlns:bpmndi': 'http://www.omg.org/spec/BPMN/20100524/DI',
			'xmlns:omgdc': 'http://www.omg.org/spec/DD/20100524/DC',
			'xmlns:omgdi': 'http://www.omg.org/spec/DD/20100524/DI',
			'xmlns:tns': 'http://www.activiti.org/test',
			'xmlns:xsd': 'http://www.w3.org/2001/XMLSchema',
			'xmlns:xsi': 'http://www.w3.org/2001/XMLSchema-instance',
			'expressionLanguage': 'http://www.w3.org/1999/XPath',
			'id': 'm1547445846249',
			'name': '',
			'targetNamespace': 'http://www.activiti.org/test',
			'typeLanguage': 'http://www.w3.org/2001/XMLSchema'
		};
	</script>
	
</html>
